<template>
  <el-row>
    <el-col :span="24">
      <Portlet>
        <el-form ref="searchForm" class="el-form-col search-form" :model="search">
          <el-row :gutter="15">
            <el-col :lg="4" :md="6">
              <el-form-item prop="orderNo" >
                <el-input v-model="search.orderNo" type="textarea" :rows="4" clearable
                          placeholder="入库订单号  (支持多单查询，用英文逗号分隔)"></el-input>
              </el-form-item>
            </el-col>
            <el-col :lg="4" :md="6">
              <el-form-item prop="warehouse">
                <el-select v-model="search.warehouse" placeholder="请选择入库仓">
                  <el-option v-for="item in warehouseIdArr"
                             :key="item.value"
                             :label="item.text"
                             :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :lg="4" :md="6">
              <el-form-item prop="inputTypeCode">
                <el-select v-model="search.inputTypeCode" placeholder="请选择入库类型">
                  <el-option label="长期仓储" value="CARGOSOURCETYPE01"></el-option>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :lg="4" :md="6">
              <el-form-item prop="cargoOwner">
                <el-input v-model="search.cargoOwner" placeholder="商家名称"></el-input>
              </el-form-item>
            </el-col>
            <el-col :lg="4" :md="6">
              <el-form-item>
                <el-row class="search-btns" :gutter="5">
                  <el-col :span="8">
                    <el-button type="primary" :loading="searchLoading" plain native-type="submit" @click.prevent="searchFunc(search)"><span>搜索</span></el-button>
                  </el-col>
                  <el-col :span="8">
                    <el-button @click="resetFields('searchForm')" plain>重置</el-button>
                  </el-col>
                </el-row>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </Portlet>
    </el-col>

    <el-col :span="24">
      <BasicTable
        ref="BasicTable"
        url="/ms-warehouse-order/recordOrder/inputWarehouseList"
        :columns="columns"
        :initParams="initParams"
      >
        <template slot="preColumn">
          <el-table-column prop="orderNo" fixed="left" width="170px" align="center" label="入库订单">
            <template slot-scope="scope">
              <a href="javascript: void (0);" @click.prevent="show(scope.row)">
                {{ scope.row.orderNo }}
              </a>
            </template>
          </el-table-column>
        </template>
        <template slot="column">
          <el-table-column fixed="right" align="center" width="100px" label="操作">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="edit(scope.row, true)"
              >
                修改
              </el-button>
              <el-button
                size="mini"
                type="text"
                @click="show(scope.row)"
              >
                详情
              </el-button>
            </template>
          </el-table-column>
        </template>
      </BasicTable>
    </el-col>
  </el-row>
</template>
<script>
import {copy} from '@/utils'
import {unixTimestampFilter, filterDataBaseDictionary} from '@/filters'
import {getAllWarehouse} from '@/utils/selectOptions'

export default {
  name: 'warehousingOrderEditIndex',
  data() {
    let columns = [
      {
        label: '入库仓',
        data: 'warehouse',
        render(data, full) {
          return filterDataBaseDictionary(data)
        }
      },
      {
        label: '入库类型',
        data: 'inputTypeCode',
        render(data, full) {
          return filterDataBaseDictionary(data)
        }
      },
      {label: '商家名称', data: 'cargoOwner'},
      {
        label: '总体积(m³)',
        data: 'totalVolume'
      },
      {
        label: '总重量(kg)',
        data: 'totalWeight'
      },
      {
        label: '总包件(件)',
        data: 'totalPackage'
      },
      {
        label: '下单人',
        data: 'founderUserName'
      },
      {
        label: '下单时间',
        data: 'foundDate',
        render(data, full) {
          return unixTimestampFilter(data)
        }
      }
    ]
    return {
      warehouseIdArr: [], // 入库仓
      inputWarehouseArr: [], // 入库状态
      searchLoading: false,
      initParams: {
        tabState: 2
      },
      search: {
        orderNo: '',
        orderType: '',
        warehouse: '',
        foundUserName: '',
        cargoOwner: '',
        inputTypeCode: ''
      },
      params: {
        pageSize: 20,
        pageNum: 1
      },
      isOpen: false,
      followTypeArr: [], // test 假数据
      columns
    }
  },
  created() {
    // 入库仓
    getAllWarehouse().then(arr => {
      this.warehouseIdArr = arr
    })
  },
  methods: {
    searchFunc(search) {
      let data = copy(search, true)
      this.searchLoading = true
      this.$refs.BasicTable.search(data).finally(_ => {
        this.searchLoading = false
      })
    },
    // 重置表单
    resetFields() {
      const searchForm = this.$refs.searchForm
      if (searchForm) {
        searchForm.resetFields()
      }
    },
    // 表格刷新
    refresh() {
      this.searchFunc(this.search)
    },
    selectionChange(rows) {
      this.rows = rows
    },
    // reset 重置搜索框
    reset(searchForm) {
      this.$refs.searchForm.resetFields()
    },
    // 排序事件
    sortChange(column, prop, order) {
      console.log(column, prop, order)
    },
    // 跟进
    setFollowRow(data) {
      this.timeBarOrderId = data.timeBarOrderId
      this.$refs.modalFollowUp.show()
    },
    // 跳转详情界面
    show(data) {
      this.$router.push({path: '/ss-oms/enterWarehouse/warehousing-order/edit-show/' + data.id})
    },
    // 跳转编辑界面
    edit(data) {
      this.$router.push({path: '/ss-oms/enterWarehouse/warehousing-order/edit/' + data.id})
    }
  }
}
</script>
